<!-- 动态表单弹出框 -->
<template>
  <div class="form-modal">
    <a-modal
      :maskClosable="false"
      :title="dynamicModal.title"
      v-model="dynamicModal.visible"
      width="60%">
      <a-form-model
        ref="modalFormData"
        :model="modalFormData"
        :rules="modalFormRules"
        :label-col="{ span: 6 }"
        :wrapper-col="{ span: 18 }">
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="顺序号" prop="OrderNum">
              <a-input type="number" v-model="modalFormData.OrderNum" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="年代号" prop="Year">
              <a-input v-model="modalFormData.Year" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="归档案卷号">
              <a-input v-model="modalFormData.Code" disabled />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="案号">
              <a-input v-model="modalFormData.WA_Stock" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item
              label="题名"
              :label-col="{ span: 3 }"
              :wrapper-col="{ span: 21 }"
              prop="Topic">
              <a-textarea v-model="modalFormData.Topic" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="保管期限" prop="BGQXData">
              <a-select v-model="modalFormData.BGQXData">
                <a-select-option v-for="item in dictionary.BGQXData" :key="item.DDL_ID">{{ item.DDL_Value }}</a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="收档日期" prop="SADate">
              <a-date-picker v-model="modalFormData.SADate" valueFormat="YYYY-MM-DD" style="width: 100%;" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="保密级别" prop="Security">
              <a-select v-model="modalFormData.Security">
                <a-select-option v-for="item in dictionary.Security" :key="item.DDL_ID">{{ item.DDL_Value }}</a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="结案日期" prop="JADate">
              <a-date-picker v-model="modalFormData.JADate" valueFormat="YYYY-MM-DD" style="width: 100%;" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="操作员">
              <a-input v-model="modalFormData.Op_ID" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="备注">
              <a-input v-model="modalFormData.Remark" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
      <template slot="footer">
        <a-button @click="dynamicModal.visible = false">取消</a-button>
        <a-button type="primary" @click="onSubmit">提交</a-button>
      </template>
    </a-modal>
  </div>
</template>

<script>
export default {
  name: '',
  components: {
  },
  props: {
    dynamicModal: {
      type: Object,
      default: () => {}
    },
    modalFormData: {
      type: Object,
      default: () => {}
    },
    modalFormRules: {
      type: Object,
      default: () => {}
    },
    dictionary: {
      type: Object,
      default: () => {}
    }
  },
  data () {
    return {}
  },
  created () {},
  mounted () {},
  methods: {
    // 表单提交事件
    onSubmit () {
      this.$refs.modalFormData.validate(valid => {
        console.log(valid, this.modalFormData)
        if (valid) {
          this.submitForm()
        } else {
          return false
        }
      })
    },
    submitForm () {
      const title = this.dynamicModal.title
      switch (title) {
        case '添加案卷':
          break
        case '修改案卷':
          break
        case '克隆新增':
          break
      }
    }
  }
}
</script>
<style lang="less" scoped>
</style>
